<template>
  <page-wrap back dark hide-tab title="身份选择" bg-color="transparent">
    <view class="identity" :style="'padding-top:' + navHeight + 'px;'">
      <view class="identity-item" v-for="(item, index) in charList" :key="index">
        <view class="identity-img">
          <image :src="item.img"></image>
        </view>
        <view :class="['btn', item.class]" @click="handleIdentity(item)">
          我要{{item.name}}
        </view>
      </view>
      
    </view>
  </page-wrap>
</template>

<script>
import companyMixin from '@/mixins/companyStatus';

export default {
  mixins: [companyMixin],
  data() {
    return {
      personId: uni.getStorageSync("person-id").slice(2) || '',
      navHeight: 0,
      selectedItem: null,
      charList: [
        {
          name: "求职",
          value: 0,
          img: this.$imgBase + "character/bg-person.png?v=1",
          url: "/pages/index/index",
          data: "personTabs",
          type: "person",
          class: 'person'
        },
        {
          name: "招聘",
          value: 1,
          img: this.$imgBase + "character/bg-company.png?v=1",
          url: "/pagesSub/company/recCard/index",
          data: "companyTabs",
          type: "company",
          class: 'company'
        },
      ],
    };
  },

  created() {
    // #ifdef MP-WEIXIN
    this.navHeight = getApp().globalData.navHeight;
    // #endif
  },
  methods: {
    handleIdentity(item) {
      this.selectedItem = item
      if(item.type == 'person') {
        this.setIdentityData()
        uni.reLaunch({
          url: item.url
        });
      } else if(item.type == 'company') {
        // this.checkCompanyStatus()
        this.getPersonBindCompanyStatus(); // from companyMixin
      }

    },

    setIdentityData() {
        getApp().globalData.tabBarList = getApp().globalData[this.selectedItem.data];
        getApp().globalData.loginStatus = this.selectedItem.type;
        uni.setStorageSync("login-status", this.selectedItem.type);
    }
  },
};
</script>

<style lang="scss">
$img-base-identity: $img-base + "identity/";
.identity {
  flex-grow: 1;
  font-size: $uni-font-size-lg;
  color: $uni-text-color-222;
  background: $uni-bg-color;
  box-sizing: border-box;
  .identity-item {
    margin-bottom: 100rpx;
    &:first-child {
      padding-top: 60rpx;
    }
  }
  .identity-img {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 80rpx;
    image {
      width: 600rpx;
      height: 386rpx;
    }
  }
  .identity-tips {
    margin-top: 32rpx;
    text-align: center;
    text-shadow: 0 0 0;
    letter-spacing: 1rpx;
    text {
      color: $u-type-primary;
    }
  }
  .btn {
    display: block;
    width: 256rpx;
    margin-left: auto;
    margin-right: auto;
    padding-left: 14px;
    padding-right: 14px;
    box-sizing: border-box;
    font-size: $uni-font-size-lg;
    text-align: center;
    line-height: 72rpx;
    color: #FFF;
    border-radius: 52rpx;
    background: $bg-linear-gradient-button;

    &.company {
      background: linear-gradient(315deg, #5565FF 0%, #7D7CFF 100%);;
    }
  }
}
</style>
